html,
body {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  /* font-family: 'Microsoft YaHei', 'PingFang SC', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif; */
}
body {
  overflow: hidden;

  background: url('@/assets/imgs/bg.png') no-repeat center center/cover;
}
#app {
  width: 100%;
  height: 100%;
  margin: 0 auto;
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.fr {
  float: right;
}
.fl {
  float: left;
}
.clear::after {
  content: '';
  display: block;
  clear: both;
}
/* .relative {
  position: relative;
}
.absolute {
  position: absolute;
}
.fixed {
  position: fixed;
} */
.textCenter {
  text-align: center;
}
.textRight {
  text-align: right;
}
.flexbox {
  display: flex;
  justify-content: center;
  align-items: center;
}
.flexcolumn {
  flex-direction: column;
}
.flexwrap {
  flex-wrap: wrap;
}
.rowreverse {
  flex-direction: row-reverse;
}
.justifyStretch {
  justify-content: stretch;
}
.justifyStart {
  justify-content: flex-start;
}
.justifyCenter {
  justify-content: center;
}
.justifyEnd {
  justify-content: flex-end;
}
.justifyBetween {
  justify-content: space-between;
}
.justifyArround {
  justify-content: space-around;
}
.justifyEvenly {
  justify-content: space-evenly;
}
.alignStretch {
  align-items: stretch;
}
.alignStart {
  align-items: flex-start;
}
.alignCenter {
  align-items: center;
}
.alignEnd {
  align-items: flex-end;
}
.webkitBox {
  display: -webkit-box;
  -webkit-box-orient: vertical;
}
/* 一行超出显示。。。 */
.oneLineEllipsis {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
/* 多行文本超出显示。。。需配合webkitBox类，同时元素自己设置超出几行数值 */
.ellipsis {
  text-overflow: ellipsis;
  overflow: hidden;
}
